<template>
  <block>
    <view class="comment-list" v-if="comments.length">
      <Comment
        :comment="item"
        v-for="item in comments"
        :key="item.comment_id"
        @reply="handleReply"
      />
    </view>
  </block>
</template>

<script>
import Comment from './comment'
export default {
  name: '',
  components: {
    Comment
  },
  props: {
    comments: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {}
  },
  computed: {},
  methods: {
    handleReply(userId) {
      this.$emit('reply', userId)
    }
  }
}
</script>

<style>
.comment-list {
  margin-top: 24rpx;
  padding: 0.5rem;
  background-color: #f7f7f7;
}
</style>
